<template>
	<view>
		<view class="item">
			<view class="item-list">教室 : {{item.rBuilding}}-{{item.rRoom}}</view>
			<view class="item-list2">可预约座位 : {{switchStatus.rCanables}}</view>
			<view class="item-list3">
				<view id="itemListClass">
					<!-- <switch v-model="value" text="on|off" @click="changeStatus"></switch> -->
					<switch :checked="switchStatus.rStatus == 1" @change="changeStatus"></switch>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				value: false,
				items: {},
				ClassRoomList: [],
				newres: {},
				switchStatus: {
					rStatus: this.item.rStatus,
					rCanables: this.item.rCanables
				}
			};
		},
		props: {
			item: {
				type: Object,
				default () {
					return {}
				}
			}
		},
		methods: {
			// 	async changeStatus(e) {
			// 		let value = e.target.value //获取当前的switch按钮的状态
			// 		let that = this
			// 		this.item.rStatus = !this.item.rStatus //使得switch按钮的状态和item.rStatus的状态是一样的
			// 		this.$set(this.switchStatus, 'rStatus', value)
			// 		if (!value) {
			// 			setTimeout(() => {
			// 				uni.showModal({
			// 					title: "关闭课室",
			// 					content: "是否要关闭课室",
			// 					success: (res) => {
			// 						if (res.confirm) {
			// 							that.$set(that.switchStatus, 'rStatus', false)

			// 							console.log('用户点击确定');
			// 						} else if (res.cancel) {
			// 							that.$set(that.switchStatus, 'rStatus', true)
			// 							console.log('用户点击取消');
			// 						}
			// 					}
			// 				})
			// 			}, 100);
			// 		} else {
			// 			setTimeout(() => {
			// 				uni.showModal({
			// 					title: "开启课室",
			// 					content: "是否要开启课室",
			// 					success: (res) => {
			// 						if (res.confirm) {
			// 							that.$set(that.switchStatus, 'rStatus', true)
			// 							// that.$set(that.switchStatus, 'rCanables', this.items.rCanables)
			// 							console.log('用户点击确定');
			// 							// location.reload()
			// 							// location.reload()
			// 						} else if (res.cancel) {
			// 							that.$set(that.switchStatus, 'rStatus', false)
			// 							// that.$set(that.switchStatus, 'rCanables', this.item.rCanables)
			// 							console.log('用户点击取消');
			// 						}
			// 					}
			// 				})
			// 			}, 100);
			// 		}
			// 		this.items = this.item
			// 		if (this.items.rStatus == true)
			// 			this.items.rStatus = "1"
			// 		else
			// 			this.items.rStatus = "0"
			// 		console.log("发送了课室的请求")
			// 		const res = await this.$myRequest({ //发送开放课室的请求
			// 			url: "/openOrCloseRoom",
			// 			data: {
			// 				"rBuilding": "",
			// 				"rCanables": "",
			// 				"rId": this.items.rId,
			// 				"rNums": 0,
			// 				"rRoom": "",
			// 				"rStatus": this.items.rStatus
			// 			},
			// 			method: 'POST'
			// 		}).then(res => {
			// 			console.log("res=>", res)
			// 			console.log("res.data.data=>", res.data.data)
			// 			that.$set(that.switchStatus, 'rCanables', res.data.data.rCanables)
			// 			if (!res.data.success)
			// 				uni.showModal({
			// 					title: "提示",
			// 					content: "当前课室有学生预约，不可以关闭",
			// 					success: (res) => {
			// 						if (res.confirm)
			// 							that.$set(that.switchStatus, 'rStatus', true)
			// 						else if (res.cancel) {
			// 							that.$set(that.switchStatus, 'rStatus', true)
			// 						}
			// 					}
			// 				})

			// 			this.$emit("uptade")
			// 		})
			// 	}
			changeStatus(e) {
				let value = e.target.value //获取当前的switch按钮的状态
				let that = this
		  	this.items = this.item
				if (value) {
					console.log("this.item.rStatus=>",this.item.rStatus)
					uni.showModal({
						title: "开启课室",
						content: "是否开启课室",
						success: (res) => {
							if (res.confirm) {
								console.log("this.items1.rId=>",this.items.rId)
								console.log("this.items1.rStatus=>",this.items.rStatus)
								console.log("发送了课室的请求")
								const res = this.$myRequest({ //发送开放课室的请求
									url: "/openOrCloseRoom",
									data: {
										"rBuilding": "",
										"rCanables": "",
										"rId": this.items.rId,
										"rNums": 0,
										"rRoom": "",
										"rStatus":"1"
									},
									method: 'POST'
								}).then(res => {
								  that.$set(that.switchStatus, 'rCanables', res.data.data.rCanables)
									console.log(res)
								})
							} else if (res.cancel) {
								 location.reload()
							   console.log("点击了取消")
								 that.$set(that.switchStatus, 'rStatus', false)
							}
						}
					})
				} else {
					console.log("this.items.rStatus=>",this.items.rStatus)
					uni.showModal({
						title: "关闭课室",
						content: "是否关闭课室",
						success: (res) => {
						if (res.confirm) {
							console.log("this.item.rId=>",this.items.rId)
							console.log("this.item.rStatus=>",this.items.rStatus)
							console.log("发送了课室的请求")
							const res = this.$myRequest({ //发送开放课室的请求
								url: "/openOrCloseRoom",
								data: {
									"rBuilding": "",
									"rCanables": "",
									"rId": this.items.rId,
									"rNums": 0,
									"rRoom": "",
									"rStatus": "0"
								},
								method: 'POST'
							}).then(res => {
								if(!res.data.success)
								uni.showModal({
									title:"提示",
									content:"该课室有学生在预约，暂时无法关闭",
									success(res) {
										if(res.confirm)
										 location.reload()
										 else if(res.cancel)
										  location.reload()
									}
								})
							 
								// that.$set(that.switchStatus, 'rCanables', res.data.data.rCanables)
								
								console.log("res=>", res)
							})
						}else if (res.cancel) {
							  location.reload()
						      console.log("取消2")
									that.$set(that.switchStatus, 'rStatus', false)
							}
						}
					})
				}
			}
		}
	}
</script>

<style lang="scss">
	.item {
		height: 75rpx;
		margin: 13rpx;
		border-radius: 20rpx;
		// display: flex;
		background-color: #ffffff;
		border: #cecece solid 3rpx;
		font-size: 31rpx;

		&-list {
			color: #797774;
			float: left;
			line-height: 70rpx;
			padding: 0 10rpx;
			justify-content: center;
			width: 40%;
		}

		&-list2 {
			color: #797774;
			float: left;
			line-height: 70rpx;
			padding: 0 0rpx;
			justify-content: center;
			width: 40%;
		}

		&-list3 {
			color: #797774;
			float: left;
			line-height: 70rpx;
			padding: 10 0rpx;
			height: 20%;
			width: 10%;
		}
	}
</style>
